// 今日已结
<template>
  <el-row class="content">

    <el-row>
      <el-table :data="list" v-loading="loading" key="listTable" header-cell-class-name='tableHeader' element-loading-text="加载中" border fit size="small">
        <el-table-column prop="order_no" label="注单号" align="center" class-name="table-label" width="180px"> </el-table-column>
        <el-table-column prop="open_date" label="时间" align="center"> </el-table-column>
        <el-table-column prop="option_code" label="类型" align="center"> </el-table-column>
        <el-table-column prop="odds" label="玩法" align="center"> </el-table-column>
        <el-table-column prop="handicaps" label="盘口" align="center"> </el-table-column>
        <el-table-column prop="amount" label="下注金额" align="center"> </el-table-column>
        <el-table-column prop="commission" label="退水(%)" align="center"> </el-table-column>
        <el-table-column prop="result" label="结果" align="center"> </el-table-column>
      </el-table>
    </el-row>

    <el-row v-show="pagination.totalCount > 0" style="margin:10px 0 0 30px;">
      <el-pagination @size-change="handlePageSizeChange" @current-change="handleCurrentChange"
                     :current-page="currentPage" :page-sizes="[10,20,30,50]" :page-size="pageSize"
                     :total="Number(pagination.totalCount)" layout="total,sizes,prev,pager,next,jumper" background>
      </el-pagination>
    </el-row>
  </el-row>
</template>

<script>
  import { mapGetters } from 'vuex'
  import { user as userMap } from '@/utils/map' // 参数映射

  export default {
    computed: {
      ...mapGetters(['memberBalanced']),
      list() {
        return this.memberBalanced ? this.memberBalanced.list : []
      },
      pagination() {
        return this.memberBalanced ? this.memberBalanced.pagination : []
      },
    },
    data() {
      return {
        loading: false,
        userMap: userMap, // 用户字段映射
        currentPage: 1,
        pageSize: 10,
      }
    },

    // 数据格式化
    filters: {},

    async created() {
      console.log('今日结算',this.memberBalanced.list)
      await this.fetchData()
    },
    methods: {
      async fetchData() {
        console.log('this.currentPage', this.currentPage)
        await this.$store.dispatch('MemberOrdersBalanced', {
          page: this.currentPage,
          'per-page': this.pageSize,
        })
      },
      // 当前页变化
      async handleCurrentChange(value) {
        this.currentPage = value
        await this.fetchData()
      },

      // 每页显示数量变化
      async handlePageSizeChange(value) {
        this.pageSize = value
        await this.fetchData()
      },
    },
    watch: {
      $route(to, from) {},
    },
  }
</script>
<style>
  .content {
    padding: 5px;
  }
</style>

